import { Button, Form, Input } from 'antd-mobile'
import { useCountDown } from '../hooks'
import { useNavigate } from 'react-router-dom'
import { Tabs } from 'antd-mobile'
function Login() {
    const nav=useNavigate()
    const onSubmit=()=>{
        console.log('ok')
          nav('/home')
    }
    const [fn,num,isDisabled]=useCountDown()
    return (
        <div><Tabs>
        <Tabs.Tab title='验证码登录' key='fruits'>
          <Form layout='horizontal' mode='card' footer={
                <Button block type='submit' color='primary' size='large' onClick={onSubmit}>
                    提交
                </Button>}>

                <Form.Item label='手机号'>
                    <Input placeholder='请输入' />
                </Form.Item>
                <Form.Item label='短信验证码' extra={<Button fill='none' onClick={()=>fn()}
                    disabled={isDisabled}>{isDisabled?`${num}s后重新发送验证码`:'获取验证码'}</Button>}>
                    <Input placeholder='请输入' />
                </Form.Item>
            </Form>
        </Tabs.Tab>
        <Tabs.Tab title='账号密码登录' key='vegetables'>
          账号密码登录
        </Tabs.Tab>
       
      </Tabs>
            
        </div>
    )
}
export default Login